<template>
	<view class="container">
		<navbar :config="config" backColor="#000"></navbar>
		<view class="tab-box" style="padding: 0">
			<view @click="tabClick(index)" class="tab" :class="tabActiveIndex==index?'active':''"
				v-for="(item,index) in tabList" :key="index">
				<view class="tabView">{{item.text}}</view>
				<image :src="imgUrl+'/career/xuxianLine.png'" class="xuxianLine"></image>
			</view>
		</view>
		<scroll-view scroll-y="true" class="list-box" refresher-enabled="true" :refresher-triggered="triggered"
			@refresherrefresh="onRefresh" @scrolltolower="tolower">
			<view class="list" >
				<view class="item" v-for="(item,index) in goodsList" :key="item.id">
					<view class="content" @click="goProductDetails(item.id,item.authorize_shop_id)">
						<image class="cover" :src="item.cover" mode="aspectFill"
							@click="goProductDetails(item.id,item.authorize_shop_id)"></image>
						<view class="title u-display1">{{item.title}}</view>
						<view class="viewWidth">
							<text class="new-price">
								<text class="company">¥</text>
								<text class="integer">{{formatPrice(item.min_sale_price,'int')}}.</text>
								<text class="float">{{formatPrice(item.min_sale_price,'float')}}</text>
							</text>
							<text class="old-price">¥{{item.min_market_price}}</text>
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
		<nodata v-if="noData" :config="{top:15,content:'暂无商品~'}"></nodata>
		<loadMore v-if="goodsList.length>0" :status="status"></loadMore>
		<!--规格-->
		<uniPopup type="bottom" ref="specOpen">
			<view class="u-bg-fff spec">
				<view class="u-plr30 flex-sb u-border pb30">
					<view class="u-flex-center">
						<image class="u-goods200" :src="choseConfig.cover?choseConfig.cover:cover"></image>
						<view class="u-ml20">
							<view class="u-999 u-font24 u-flex-center">
								<view class="u-FF0000 u-font36">
									<rich-text
										:nodes="$mUtil.priceBigSmall(choseConfig.sale_price?choseConfig.sale_price:moPrice)">
									</rich-text>
								</view>
								<text
									class="u-del u-ml15">￥{{choseConfig.market_price?choseConfig.market_price:moDelPrice}}
								</text>
							</view>
							<view class="u-font22 u-999 u-mt5">库存 {{stock}} 件</view>
							<view class="u-1A1A1A u-mt25">{{choseConfig.sku_set_name?choseConfig.sku_set_name:'请选择'}}
							</view>
						</view>
					</view>
					<view class="iconfont u-999 closeIcon" @click="specOpenClose">&#xe603;</view>
				</view>

				<view>
					<view class="overHeight">
						<view class="u-mt30" v-for="(item,index) in skuTab" :key="item.head.id">
							<view class="u-plr30">{{item.head.name}}</view>
							<view class="u-mt20 u-border pb30">
								<view class="u-plr30 u-flex u-flex-warp">
									<view class="spec-item " :class="childrenItem.flag?'activeColor':''"
										@click="chonseSku(index,childrenItem.id)" v-for="childrenItem in item.values"
										:key="childrenItem.id">{{childrenItem.name}}</view>
								</view>
							</view>
						</view>
					</view>
					<view class="u-plr30 u-mt30">
						<view class="u-flex-center-sb">
							<view>购买数量</view>
							<view class="u-flex-center">
								<view class="iconfont minus" @click="resNum">&#xe60b;</view>
								<view class="num">{{add_num}}</view>
								<view class="iconfont plus-sign " @click="addNum">&#xe81a;</view>
							</view>
						</view>
						<view class="specOpen-btn">
							<view>
								<button class="u-btn-two" @click="btnBuy()">加入购物车</button>
							</view>
						</view>
					</view>
				</view>
			</view>
		</uniPopup>
		<!--页面加载动画-->
		<ldLoading isFullScreen :active="loading"></ldLoading>
	</view>
</template>
<script>
	import {
		mapGetters,
		mapMutations
	} from 'vuex';
	let app = getApp()
	import uniPopup from "../../components/uni-popup/uni-popup.vue"
	export default {
		components: {
			uniPopup
		},
		data() {
			return {
				tabActiveIndex: 0,
				tabList: [{
					text: '综合',
					hasIcon: false,
					sort: ''
				}, {
					text: '最新',
					hasIcon: false,
					sort: ''
				}, {
					text: '价格',
					hasIcon: true,
					sort: '' // asc或desc
				}, {
					text: '销量',
					hasIcon: true,
					sort: '' // asc或desc
				}],
				category_idTwo: '',
				category_idOne: '',
				statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
				sticky: uni.getSystemInfoSync().statusBarHeight + 60,
				imgUrl: this.$mConfig.staticUrl,
				showHidden: false,
				twoIndex: null,
				price: 100,
				Listbox: false,
				categoryTwo: [],
				goodsList: [],
				showCategoryIndex: 0,
				categoryList: [

				],
				config: {
					back: true, //false是tolbar页面 是则不写
					title: '商品分类',
					//背景颜色;参数一：透明度（0-1）;参数二：背景颜色（array则为线性渐变，string为单色背景）
					color: '#000',
					//背景颜色;参数一：透明度（0-1）;参数二：背景颜色（array则为线性渐变，string为单色背景）
					backgroundColor: [1, "#F9F9F9"],
					statusBarFontColor: '#1A1A1A',
					backIconColor: "#000",
				},
				loading: true,
				checkId: null,
				status: 'more', //more|loading|noMore
				triggered: false,
				skuTab: [], //sku二位数组
				goodsSkuList: [], //sku组合值
				choseConfig: {},
				moPrice: '',
				moDelPrice: '',
				noData: false,
				cover: '',
				add_num: 1,
				hasId: '',
				stock: 0,
				goods_id: null,
				limit_buy_num: 0,
				shopid: '',
				params: {
					houniao_level1_category_id: null,
					limit: 10,
					page: 1,
					order_type: 0,
					order_mode: 'desc',
				},
				top: 0,
				cateId: 0, // 一级分类id
				scrollTop: 0,
				old: {
					scrollTop: 0
				}

			}
		},
		onLoad(e) {
			this.top = app.globalData.barHeight + 110
			if (e.name) {
				this.config.title = e.name
			}
		},
		onShow() {
			this.cateId = this.$store.state.cateId;
			// this.cateId = 108;
			if (this.cateId != 0) {
				let index = this.categoryList.findIndex(item => {
					if (item.id == this.cateId) return true
					// if(item.children&&item.children.length>0){
					// 	let arr=item.children;
					// 	for(let i=0; i<arr.length;i++){
					// 		if(arr[i].id==this.cateId){
					// 			this.twoIndex=i
					// 			return true
					// 		}
					// 	}
					// }
				})
				this.showCategoryIndex = index
			} else {
				this.showCategoryIndex = 0
			}
			this.rest()
			this.getAllNav();
		},
		onPullDownRefresh() {
			this.cateId = this.$store.state.cateId;
			if (this.cateId != 0) {
				let index = this.categoryList.findIndex(item => {
					return item.id == this.cateId
				})
				this.showCategoryIndex = index
			} else {
				this.showCategoryIndex = 0
			}
			this.rest()
			this.getAllNav();
			uni.stopPullDownRefresh();
		},
		// onPageScroll: function(e) { //nvue暂不支持滚动监听，可用bindingx代替
		// 	console.log("没进来是不tolower")
		// 	this.status = 'loading'
		// 	this.params.page++
		// 	this.getShopList()
		// },
		methods: {
			formatPrice(price, type) {
				let str = ''
				if (type == 'int') {
					str = String(price).split('.')[0]
				}
				if (type == 'float') {
					str = String(price).split('.').length <= 1 ? '00' : (String(price).split('.')[1])
				}
				return str;
			},
			backFun() {
				uni.navigateBack({
					delta: 1
				})
			},
			goProductDetails(id, shopid) {
				// debugger
				uni.navigateTo({
					url: "/pages/product/goods/goods?id=" + id + "&shopid=" + shopid
				})
			},
			// 减数量
			resNum() {
				if (this.add_num > 1) {
					this.add_num--
				}
			},
			//加数量
			addNum() {
				this.add_num++
			},
			chonseSku(index, id) {
				this.skuTab[index].values.forEach(res => {
					res.flag = false
					if (res.id == id) {
						res.flag = true
					}
				})
				let choseId = []
				this.skuTab.forEach(res => {
					res.values.forEach(Key => {
						if (Key.flag) {
							choseId.push(Key.id)
						}
					})
				})
				let totalId = choseId.join('|')
				this.hasId = totalId
				this.goodsSkuList.forEach(res => {
					if (res.sku_hash_code == totalId) {
						this.choseConfig = res
						this.stock = res.able_stock
						this.able_stock = res.able_stock
					}
				})

			},
			//加入购物车
			btnBuy() {
				let data = {
					goods_id: this.goods_id,
					sku_hash_code: this.hasId,
					add_num: this.add_num,
					source_shop_id: this.shopid
				}

				// 判断是否选中sku
				if (this.skuTab.length > 0 && this.hasId == "") {
					this.$mUtil.toast('请选中sku')
					return false
				}

				// 判断限购
				if (this.add_num > this.limit_buy_num && this.limit_buy_num != 0) {
					this.$mUtil.toast('商品限购' + this.limit_buy_num + '件')
					return false
				}
				//判断库存
				if (this.goodsSkuList.length > 0 && this.able_stock < this.add_num) {
					this.$mUtil.toast('商品库存只有' + this.able_stock + '件')
					return false
				}
				this.$http.post(`/cart/add`, data)
					.then(res => {

						if (res && res.code == 200) {
							this.$mUtil.toast('添加成功')
							this.$refs.specOpen.close()
							this.choseConfig = {}
							this.add_num = 1
						}
					})
			},
			addCart(id, shopid) {
				this.shopid = shopid
				if (id) {
					this.checkSku(id, shopid)
				}
				// if(flag){
				// 	this.$mUtil.toast('代理商品不能加入购物车')
				// }else{
				// 	//加入购物车
				// 	if(id){
				// 		this.checkSku(id)
				// 	}
				// }
			},
			//关闭规格弹窗
			specOpenClose() {
				this.choseConfig = {}
				this.add_num = 1
				this.$refs.specOpen.close()
			},
			rest() {
				this.noData = false
				this.params.page = 1
				this.goodsList = []
			},
			onRefresh(e) {
				this.triggered = true
				this.rest()
				this.getShopList()

			},
			// //滚动
			tolower(e) {
				console.log("没进来是不tolower")
				this.status = 'loading'
				this.params.page++
				this.getShopList()
			},
			// onScroll(e) {
			// 	console.log("e", e)
			// 	this.tolower();
			// 	// { detail: { scrollTop, scrollHeight } }
			// 	this.old.scrollTop = e.detail.scrollTop
			// 	const largerThreshold = viewHeight * 3 / 4; // 距离底部距离 视图高度的 3/4
			// 	if (
			// 		scrollTop + viewHeight + props.threshold < scrollHeight // onScrollToLower 不触发
			// 		&&
			// 		scrollTop + viewHeight + props.threshold >= scrollHeight
			// 	) {

			// 		this.tolower(); // 手动触发 onScrollToLower
			// 	}
			// },


			//查询sku
			checkSku(id, shopid) {
				this.$http.get(`/goods/skus/${shopid}/${id}`)
					.then(res => {
						if (res && res.code == 200) {
							res.data.goods.sku_table.forEach(keys => {
								keys.values.forEach(val => {
									val.flag = false
								})
							})
							this.limit_buy_num = res.data.goods.limit_buy_num
							this.goods_id = res.data.goods.id
							this.skuTab = res.data.goods.sku_table
							this.goodsSkuList = res.data.goods_sku_list
							this.moPrice = res.data.goods.min_sale_price
							this.moDelPrice = res.data.goods.max_sale_price
							this.cover = res.data.goods.cover
							this.stock = res.data.total_stock
							if (res.data.goods.sku_table.length > 0) {
								if (res.data.goods_auth) {
									if (res.data.goods_auth.added) {
										this.$refs.specOpen.open()
									} else {
										this.$mUtil.toast('该商品已经下架')
									}
								} else {
									this.$mUtil.toast('没有经营权限')
								}

							} else {
								this.hasId = ''
								this.btnBuy()
							}
						}
					})
			},
			getShopList() {
				this.$http.get(`/goods/all/pages`, this.params)
					.then(res => {

						this.loading = false;
						this.triggered = false
						if (res && res.code == 200) {
							this.goodsList = this.goodsList.concat(res.page.list)
							if (this.goodsList.length == 0) {
								this.noData = true
							} else {
								this.noData = false
							}

							if (res.page.totalPage <= res.page.currPage) {
								this.status = 'noMore'
							} else {
								this.status = 'more'
							}
						}
					})
			},
			getAllNav() {

				//let shop = uni.getStorageSync('shop')
				//let shopid = shop.id ? shop.id : ''
				this.loading = false;
				this.$http.get(`/category/all`)
					.then(res => {
						if (res && res.code == 200) {
							this.categoryList = res.list
							if (this.cateId != 0) {
								console.log(this.categoryList)
								let index = this.categoryList.findIndex(item => {
									if (item.id == this.cateId) return true
									if (item.children && item.children.length > 0) {
										let arr = item.children;
										for (let i = 0; i < arr.length; i++) {
											if (arr[i].id == this.cateId) {
												this.twoIndex = i
												return true
											}
										}
									}
								})
								if (index != -1) {
									this.showCategoryIndex = index
									this.params.houniao_level1_category_id = this.cateId
									this.categoryTwo = res.list[index].children
								}
							} else {
								this.params.houniao_level1_category_id = this.params.houniao_level1_category_id || res
									.list[0].id
								this.categoryTwo = res.list[0].children
							}




							if (res.list.length > 0) {
								this.checkId = res.list[0].id
							}

							// this.categoryTwo = this.categoryList[index].children
							this.getShopList()
						}
					})
			},
			moveHandle() {},
			//搜索页
			gosearch() {
				uni.navigateTo({
					url: "../product/search/productList?category_id=" + this.params.houniao_level1_category_id
				})
			},
			// 二级分类切换显示
			twoChildren(index, id) {
				console.log(index)
				this.twoIndex = index

				this.category_idTwo = id

				this.params.houniao_level1_category_id = this.category_idOne + "_" + this.category_idTwo
				this.rest()
				this.getShopList()
				console.log('category_id:' + this.params.houniao_level1_category_id)
			},
			tabClick(index) {
				let that = this;
				this.tabActiveIndex = index;
				if (index != 0 && index != 1) {
					if (this.tabList[index].sort == '') {
						if (index == 2) {
							this.tabList[index].sort = 'asc';
						} else if (index == 3) {
							this.tabList[index].sort = 'desc';
						}
					} else {
						this.tabList[index].sort = this.tabList[index].sort == 'asc' ? 'desc' : 'asc'
					}
				}
				this.$emit('tabChange', {
					index,
					sort: this.tabList[index].sort
				})

				if (index == 0) {
					this.params.order_type = 1
				}
				if (index == 1) {
					this.params.order_type = 2
				}
				if (index == 2) {
					this.params.order_type = 3
				}
				if (index == 3) {
					this.params.order_type = 4

				}
				this.goodsList = []
				this.getShopList()
			},

			// 分类切换显示
			showCategory(index, id) {
				console.log(index, id, 222222)
				this.showCategoryIndex = index
				this.twoIndex = null
				this.category_idOne = id
				// this.params.category_id = id
				this.params.houniao_level1_category_id = this.category_idOne + "_" + this.category_idTwo
				this.categoryTwo = this.categoryList[index].children
				this.rest()
				this.getShopList()
				if (this.cateId != 0) {
					this.$store.commit('changeCateId', 0)
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.leftbox {
		height: 60rpx;
		line-height: 60rpx;
		background-color: #ffffff;
		border-radius: 30rpx;
	}

	.addShopCard {
		position: absolute;
		width: 54rpx;
		height: 54rpx;
		border-radius: 50%;

		color: #FFFFFF;
		line-height: 54rpx;
		text-align: center;
		font-size: 32rpx;
		right: 0;
		bottom: 30rpx;
	}

	.bgc {
		background-color: #0B844A;
	}

	.bga {
		background-color: #ccc;
	}


	.showHidden {
		position: absolute;
		bottom: 0;
		top: 92rpx;
		width: 570rpx;
		z-index: 2;
		background-color: rgba($color: #000000, $alpha: .5);

		.contCase {
			background-color: #fff;
			padding: 30rpx 0 30rpx 30rpx;

			.caseitem {
				background-color: #F5F5F5;
				border-radius: 46rpx;
				width: 145rpx;
				height: 68rpx;
				line-height: 68rpx;
				text-align: center;
				margin-right: 30rpx;
				margin-bottom: 30rpx;
				box-sizing: border-box;
			}

			.caseitem.active {
				background: #abc5b5;
				border: 2rpx solid #284534;
				color: #0B844A;

			}
		}
	}

	.goodsbox {
		.leftList {
			width: 180rpx;
			left: 0px;
		}

		.on {
			width: 180rpx;
			height: 85rpx;
			border-radius: 0rpx 0rpx 0rpx 0rpx;
			background-color: #FFFFFF;
			font-weight: 600;
			font-size: 27rpx;
			color: #FF211F;
			border-radius: 20rpx;
			border-top-right-radius: 0;
			border-bottom-right-radius: 0;
		}

		.rightlist {
			right: 0rpx;
			padding: 0 19rpx;
			box-sizing: border-box;
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;
			flex-wrap: wrap;
			width: 100%;
			background-color: #f9f9f9;



			.Listbox {
				position: absolute;
				// top: 90rpx;
				bottom: 0upx;
				right: 0;

				.listcont {
					padding: 30rpx;
				}
			}

			.istop {
				top: 130rpx
			}

			.itemList {
				position: relative;

				display: flex;
				flex-direction: column;
				justify-content: flex-start;
				align-items: flex-start;

				width: 346rpx;
				height: 471rpx;
				background: #FFFFFF;
				border-radius: 19rpx 19rpx 19rpx 19rpx;
			}

			.secoundList {
				width: 558rpx;
				height: 77rpx;
				background: #F5F5F5;
				border-radius: 19rpx 0rpx 0rpx 19rpx;
				margin-top: 19rpx;
				margin-left: 19rpx;

				.list-cell {
					white-space: nowrap;
					padding: 0 20rpx;
					box-sizing: border-box;

				}

				.list-cell /deep/.uni-scroll-view-content {
					display: flex;
					flex-direction: row;
					justify-content: flex-start;
					align-items: center;
				}

				.sList {
					// display: inline-block;
					color: #999999;
					margin-right: 38rpx;
				}

				.sList.onXin {
					color: #FF211F;
					display: flex;
					flex-direction: row;
					justify-content: center;
					align-items: center;
					background-color: #F5F5F5;
					font-weight: bold;

					// font-weight: bold;
				}

				.rightIcons {
					width: 45rpx;
					height: 90rpx;
					line-height: 90rpx;
					background-color: #fff;
					position: absolute;
					right: 0;
					text-align: right;
					top: 0rpx;

					.tes {
						display: block;
						transform: rotate(90deg);
					}
				}
			}
		}
	}

	//弹窗
	.spec {
		.pb30 {
			padding-bottom: 30rpx;
		}

		.closeIcon {
			position: absolute;
			right: 0;
			top: 30rpx;
		}

		border-radius: 18rpx 18rpx 0rpx 0rpx;
		padding-top: 30rpx;
		max-height: 900rpx;
		overflow-y: auto;

		.spec-item {
			background-color: #F6F6F6;
			border: 1px solid #F6F6F6;
			padding: 12rpx 30rpx;
			font-size: 24rpx;
			color: #1A1A1A;
			border-radius: 4px;
		}

		.activeColor {
			background-color: #E1E6E3;
			border: 1px solid #01321D;
			color: #01321D;
			border-radius: 4px;
		}

		.spec-item:not(:last-child) {
			margin-right: 24rpx;
		}



		//减号
		.minus {
			width: 50rpx;
			height: 50rpx;
			line-height: 50rpx;
			text-align: center;
			background: #dedede;
			border-radius: 8rpx 0rpx 0rpx 8rpx;
		}

		.num {
			width: 74rpx;
			height: 46rpx;
			line-height: 46rpx;
			text-align: center;
			border: 1px solid #dedede;
		}

		//加号
		.plus-sign {
			width: 50rpx;
			height: 50rpx;
			line-height: 50rpx;
			text-align: center;
			background: #dedede;
			border-radius: 0rpx 8rpx 8rpx 0rpx;
		}

		.specOpen-btn {
			margin-top: 68rpx;
			padding-bottom: 34rpx;

			button {
				background-color: #0B844A;
				color: #FFFFFF;
			}
		}


	}

	.scorll {
		height: calc(100vh - 210rpx - var(--status-bar-height));
	}

	.search {
		width: 31rpx;
		height: 31rpx;
		padding-left: 19rpx;
		padding-right: 4rpx;
	}

	.nameView {
		font-weight: 400;
		font-size: 23rpx;
		color: #858687;
	}

	.container {}

	.searchView {

		background: #FFFFFF;
		border-radius: 15rpx 15rpx 15rpx 15rpx;
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items: center;
		width: 712rpx;
		height: 65rpx;
		background: #FFFFFF;
		border-radius: 12rpx 12rpx 12rpx 12rpx;
		margin: 0 auto;
		margin-top: 19rpx;

	}

	.leftView {
		width: 100%;
		height: 85rpx;

		font-weight: 400;
		font-size: 25rpx;
		color: #999999;
		line-height: 38rpx;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		position: relative;
		border-radius: 20rpx;

	}

	.onClass {
		height: 38rpx;
		width: 6rpx;
		position: absolute;
		left: 0;
	}

	.goodsImage {
		border-radius: 20rpx;
		width: 346rpx;
		height: 356rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
	}

	.goodsView {
		padding-top: 26rpx;
		width: 308rpx;
		height: 60rpx;
	}

	.viewWidth {
		margin-left: 19rpx;
	}

	.titleView {
		font-weight: 600;
		font-size: 27rpx;
		color: #000000;
		margin-bottom: 57rpx;
		margin-left: 19rpx;
	}

	/deep/.hx-navbar__content__main_center {
		background-color: #fff;
	}

	.tab-box {
		position: sticky;
		top: 0;
		left: 0;
		background-color: white;
		z-index: 50;
		height: 86rpx;
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		box-sizing: border-box;
		border-bottom: none;
		height: 85rpx;

		.tab {
			height: 86rpx;
			line-height: 86rpx;
			font-size: 30rpx;
			font-weight: 400;
			text-align: left;
			color: #666666;
			width: 25%;
			background: #FFFFFF;
			border-radius: 0rpx 0rpx 0rpx 0rpx;
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;

			&.active {
				font-weight: 500;
				font-size: 27rpx;
				color: #FF211F;
				line-height: 27rpx;

			}

		}

	}

	.tab-box .tab::before {
		background-color: #fff;
	}

	.xuxianLine {
		height: 27rpx;
		width: 2rpx;
		position: absolute;
		right: 0;
	}

	.list-box {
		
		// padding: 19rpx;
		height: 1500rpx;
		width: 100%;
		margin: 0;
		padding: 19rpx;
		box-sizing: border-box;

		.list {

			width: 100%;
			height: auto;
			background: #F9F9F9;
			// border-radius: 19rpx 19rpx 19rpx 19rpx;
			margin-bottom: 19rpx;
			border-radius: 40rpx;
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			justify-content: space-between;
			box-sizing: border-box;
			


			.item {
				background-color: white;
				width: 346rpx;
				box-sizing: border-box;
				margin-bottom: 30rpx;
				border-radius: 40rpx;
				padding-bottom: 28rpx;
				filter: drop-shadow(1px 2px 4px rgba(26, 58, 70, 0.1));
				height: 471rpx;


				// width: 179px;
				//     height: 244px;
				//     background: #FFFFFF;
				//     margin-bottom: 9px;
				//     border-radius: 20px;



				.cover {
					width: 346rpx;
					height: 356rpx;
					background-color: #f7f7f7;
					display: block;
					border-radius: 40rpx 40rpx 0 0;
				}

				.content {
					// padding: 0 15rpx;
					width: 100%;
					padding-bottom: 19rpx;

					// .title-box {
					// height: 75rpx;



					.tag {
						vertical-align: middle;
						margin-right: 15rpx;
						width: 112rpx;
						height: 30rpx;
						line-height: 28rpx;
					}

					.title {
						font-weight: 400;
						font-size: 25rpx;
						color: #333333;
						line-height: 25rpx;
						margin-top: 19rpx;
						margin-bottom: 23rpx;
						margin-left: 19rpx;
						width: 323rpx;

						overflow: hidden;
						text-overflow: ellipsis;
						display: -webkit-box;
						-webkit-line-clamp: 1;
						-webkit-box-orient: vertical;
						font-weight: 400;
						font-size: 25rpx;
						color: #333333;
						line-height: 27rpx;

					}

					// }

					.tag2 {
						vertical-align: middle;
						margin-right: 15rpx;
						width: 101rpx;
						height: 33rpx;
					}

					.desc-box {
						margin-top: 22rpx;
						display: flex;
						justify-content: space-between;
						align-items: center;

						.left {
							line-height: 24rpx;

							.integral-icon {
								font-size: 50rpx;
								color: #22a736;
								vertical-align: middle;
							}

							.integral-num {
								font-size: 24rpx;
								font-family: PingFang SC, PingFang SC-Medium;
								font-weight: 500;
								text-align: left;
								color: #808080;
								line-height: 24rpx;
							}


						}

						.have {
							font-size: 24rpx;
							font-family: PingFang SC, PingFang SC-Regular;
							font-weight: 400;
							text-align: left;
							color: #999999;
						}
					}
				}
			}
		}
	}

	.list :nth-child(1) {
		margin-left: 0;
		padding-left: 0;
	}

	.new-price {
		font-weight: bold;
		font-size: 27rpx;
		color: #FF211F;
		line-height: 27rpx;


		.company {
			font-size: 27rpx;
		}

		.integer {
			font-size: 27rpx;
		}

		.float {
			font-size: 27rpx;
			font-weight: 400;
		}
	}

	.old-price {

		font-weight: 400;
		font-size: 23rpx;
		color: #BCBCBC;
		line-height: 17rpx;
		text-decoration: line-through;
		margin-left: 6rpx;
	}

	/deep/.uni-scroll-view-content {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
	}
</style>